<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link href="/lib/ligerUI/skins/Aqua/css/ligerui-all.css"
	rel="stylesheet" type="text/css" />
<link href="/lib/ligerUI/skins/ligerui-icons.css" rel="stylesheet"
	type="text/css" />
	
</head>
<body>
	<div id="toolbar"></div>
	<div id="maingrid"></div>
	<script type="text/javascript" src="/lib/jquery/jquery-1.9.0.min.js"></script>
	<script src="/lib/ligerUI/js/ligerui.all.js"></script>
	<script type="text/javascript">
	var gridManager = null;
	
		$("#toolbar").ligerToolBar({
			items : [ {
				text : '增加',
				click : f_add,
				icon : 'add'
			}, {
				line : true
			}, {
				text : '修改',
				click : f_edit,
				icon : 'edit'
			}, {
				line : true
			}, {
				text : '删除',
				click : f_delete,
				icon : 'delete'
			} ]
		});
		
		function f_add(item) {
			//alert(item.text);
			$.ligerDialog.open({
				title: item.text,
				width: 500,
				height: 500,
				url: '/user/form',
				buttons: [
				            { text: '保存', 
				            	onclick: function (item, dialog) { 
				            		dialog.frame.save();
				            		setTimeout(function() {
				            			dialog.close();
				            			gridManager.reload();
				            		},200)
				            	},
				            	cls:'l-dialog-btn-highlight' },
				            { text: '重置', onclick: function(item, dialog) {
				            	dialog.frame.reset();
				            }, cls:'l-button'},
				            { text: '取消', 
				              onclick: function (item, dialog) { dialog.close(); } }
				         ],
				modal: true, 
				isResize: true,
				act:2
			});
		}
		
		function f_edit(item) {
			//alert(item.text);
			var selectedRow = gridManager.getSelectedRow();
			if (selectedRow == null) {
				$.ligerDialog.warn("请选择行！");
				return;
			}
			var id = selectedRow.id;
			$.ligerDialog.open({
				title: item.text,
				width: 500,
				height: 500,
				url: '/user/form',
				urlParms: {id:id, act:3},
				buttons: [
				            { text: '保存', 
				            	onclick: function (item, dialog) { 
				            		dialog.frame.save();
				            		setTimeout(function() {
				            			dialog.close();
				            			gridManager.reload();
				            		},200)
				            	},
				            	cls:'l-dialog-btn-highlight' },
				            { text: '重置', onclick: function(item, dialog) {
				            	dialog.frame.reset();
				            }, cls:'l-button'},
				            { text: '取消', 
				              onclick: function (item, dialog) { dialog.close(); } }
				         ],
				modal: true, 
				isResize: true
			});
		}
		
		function f_delete() {
			var selectRow = gridManager.getSelectedRow();
			if (selectRow == null) {
				$.ligerDialog.warn("请选择行！");
				return;
			}
			
		}
		
		function test() {
			alert("hello world");
		}
		
		gridManager = $( "#maingrid" ).ligerGrid({
			columns: [
			          {display:'ID', name:'id',width:'60',align:'center'},
			          
			          {display:'姓名', name:'name',width:'120',align:'center'},
			          {display:'年龄', name:'age', width:'100',align:'center'},
			          {display:'性别', name:'sex',width:'100',align:'center',
			        	  render: function(item) {
			        		  return (item.sex)? "男" : "女";
			        		  //return item.sex;
			           }
			          },
			          {display:'手机号', name:'tel',width:'120',align:'center'},
			          {display:'地址', name:'address', width:'150',align:'center'}
			 ], 
			 root:'list',
			 record:'totalPage',
			 page:1,
			 pageSize:10,
			 width:'100%', 
			 height:'90%', 
			 url:'/user/json', 
			 rownumbers:true,
			 enabledSort:true
		});
	</script>
</body>
</html>